import React, { lazy } from 'react';
import { RouteComponentProps } from 'react-router'
// 组件
const Home = lazy(() => import('../pages/Home'))
const NewsGroup = lazy(() => import('../pages/News/NewsGroup'))
const NewsDetailPage = lazy(() => import('../pages/News/NewsDetailPage'))
const Calculator = lazy(() => import('../pages/ReactDemo/StateUp/Calculator'))
const ShowDialog = lazy(() => import('../pages/ReactDemo/Slot/ShowDialog'))
const Foundation = lazy(() => import('../pages/ReactDemo/Foundation'))
const CustomA = lazy(() => import('../pages/ReactDemo/ReduxDemo/CustomA'))
const HooksCom = lazy(() => import('../pages/ReactDemo/HooksCom'))

export interface IFRouteItem {
    path: string;
    title: string;
    component?: React.ComponentType<any>;
    beforeEnter?: (props: RouteComponentProps, Com: React.ReactElement) => React.ReactElement;
    onAuthLogin?: boolean; // 是否取消登录校验
}

// 静态路由
export const staticRoutes: IFRouteItem[] = [
    {
        path: '/app/home',
        title: '首页',
        component: Home
    },
    {
        path: '/app/news/group',
        title: '新闻列表',
        onAuthLogin: true,
        component: NewsGroup
    },
    {
        path: '/app/news/detail/page',
        title: '新闻详情',
        component: NewsDetailPage
    },
    {
        path: '/app/state/up',
        title: '状态提升',
        component: Calculator
    },
    {
        path: '/app/show/dialog',
        title: '组件插槽使用',
        component: ShowDialog
    },
    {
        path: '/app/foundation',
        title: 'React基础示例',
        component: Foundation
    },
    {
        path: '/app/redux',
        title: 'redux 示例',
        component: CustomA
    },
    {
        path: '/app/hooks',
        title: 'React Hooks',
        component: HooksCom
    }
]